/*
 * @Author: zhangrongqiu
 * @Date: 2025-10-19 17:52:32
 * @LastEditTime: 2025-11-02 11:43:24
 * @LastEditors: zhangrongqiu
 * @Description:
 */
import React, { useState, useEffect } from 'react'
import StepProgress from '@/components/StepProgress'
import CitySelector from '@/components/CitySelector'
import RadioQuestion from '@/components/RadioQuestion'
import { View, Text, Input } from '@tarojs/components' // 引入 Input
import Taro from '@tarojs/taro'; // 引入 Taro 用于页面跳转
import './index.scss'

function Index() {
  // 状态管理
  const [currentStep, setCurrentStep] = useState(1) // 1: 基本信息, 2: 职位选择 (虽然现在职位选择是新页面，但可以保留这个状态用于其他逻辑)

  // 城市选择
  const handleCityChange = (city) => {
    console.log('用户所在城市:', city)
  }

  // 工作阶段选项
  const [workStage, setWorkStage] = useState('')
  const workStageOptions = [
    {
      value: 'noExperience',
      label: '无工作经验（往届未就业/应届毕业生）',
    },
    {
      value: 'hasExperience',
      label: '有工作经验（在职/求职中）',
    },
  ]

  // 没上班时间选项
  const [noWorkTime, setNoWorkTime] = useState('')
  const noWorkTimeOptions = [
    {
      value: '1',
      label: '🔋 在职：电量100%',
    },
    {
      value: '2',
      label: '📮 3个月以内：简历没人理',
    },
    {
      value: '3',
      label: '📉 3-6个月：要不上价了',
    },
    {
      value: '4',
      label: '🪫 半年-1年：半废品',
    },
    {
      value: '5',
      label: '🧟 1年以上：基本废了',
    },
  ]

  // 职位选择
  const [selectedJob, setSelectedJob] = useState('') // 存储选中的职位

  // 处理跳转到职位选择页面
  const handleJobSelectClick = () => {
    // Taro.navigateTo({
    //   url: '/pages/jobSelect/index',
    //   events: {
    //     // 为页面间通信定义一个 "acceptDataFromOpenedPage" 事件，用于接收数据
    //     acceptDataFromOpenedPage: function(data) {
    //       console.log('从职位选择页面返回的数据:', data);
    //       setSelectedJob(data.jobName); // 更新本地状态
    //     }
    //   }
    // })
  }

  // 模拟下一步按钮（可选，如果需要）
  const handleNextStep = () => {
    if (!workStage || !noWorkTime) {
      console.log('请先完成基本信息')
      return
    }
    // 如果你想在当前页面保留职位选择逻辑，可以在这里处理
    // setCurrentStep(2)
    // 或者直接提交数据
  }

  return (
    <View className='index'>
      <View className='header'>
        <View className='title'>🎯 测一测，你超越了身边多少同龄人？</View>
        <View className='small-title'>2步快速测评，生成你的专属竞争力报告 ✨</View>
      </View>
      <View className='card'>
        <StepProgress currentStep={1} totalSteps={2} />
      </View>
      <View className='card'>
        <CitySelector onCityChange={handleCityChange} />
      </View>
      <View className='card'>
        <View className='mb-40'>坦白局：你目前在哪个阶段"混"？</View>
        <RadioQuestion
          options={workStageOptions}
          value={workStage}
          onChange={setWorkStage}
        />
      </View>
      <View className='card'>
        <View className='mb-40'>⏳ 多久没上班了？</View>
        <RadioQuestion
          options={noWorkTimeOptions}
          value={noWorkTime}
          onChange={setNoWorkTime}
        />
      </View>
      <View className='card'>
        {/* <View className='mb-40'>岗位（搜索选择）</View>
        <Input
          className="job-select-input"
          placeholder="点击选择岗位"
          value={selectedJob || ''} // 显示选中的职位，如果未选择则显示空字符串
          onInput={() => {}} // 防止编辑
          onClick={handleJobSelectClick} // 点击时跳转
          disabled // 设置为禁用，使其只读
        /> */}
      </View>
      {/* 模拟下一步按钮 */}
      <View className='card'>
        <View className='next-btn'>
          <View className='button-wrapper' onClick={handleNextStep}>
            <View className='button-text'>下一步</View>
          </View>
        </View>
      </View>
    </View>
  )
}

export default Index